<template>
  <el-container style="text-align: right; font-size: 12px">
    <el-backtop :bottom="60"></el-backtop>
    <!--********** 头部 -->
    <el-header style="height:auto;padding:0">
      <e-header></e-header>
      <e-contentFrame> </e-contentFrame>
      <e-contentTag> </e-contentTag>
      <!-- 广告位 -->
      <div class="new-advlocation">
        <e-advertisingSpace> </e-advertisingSpace>
      </div>
    </el-header>
    <!--********** 主体 -->
    <el-main style="height:auto">
      <!-- <div
        class="mo_login"
        v-loading="loading"
        element-loading-text="拼命加载中"
        element-loading-spinner="el-icon-loading"
        element-loading-background="#ffffff"
      > -->
      <div class="add_line">
        <div class="addbreadcrumb">
          <el-breadcrumb separator-class="el-icon-arrow-right">
            <el-breadcrumb-item :to="{ path: '/' }"
              >您当前的位置：首页</el-breadcrumb-item
            >
            <el-breadcrumb-item :to="{ path: '/Mypublish' }">{{
              text_cate_name
            }}</el-breadcrumb-item>
            <el-breadcrumb-item>发布信息</el-breadcrumb-item>
          </el-breadcrumb>
        </div>
      </div>

      <div class="mo_login">
        <div class="text_title">
          <p>发布信息</p>
          <p class="title-yin">Release information</p>
          <div class="title-line"></div>
        </div>
        <div class="text_msg">
          <div class="msg_headline">
            <span> 文章标题</span>
            <el-input
              class="headline-input"
              placeholder="请输入标题"
              v-model="head_title"
              clearable
            >
            </el-input>
          </div>
          <div class="msg_headline-2">
            <span> 发布行业</span>
            <el-select
              class="headline-input"
              v-model="Industry_tag"
              placeholder="请输入发布行业"
            >
              <el-option
                v-for="(item, index) in label_list"
                :key="index"
                :label="item.name"
                :value="item.id"
              ></el-option>
              <!-- <el-option label="供应商" value="shanghai"></el-option>
              <el-option label="采购商" value="beijing"></el-option> -->
            </el-select>
          </div>
          <div class="msg_headline-2">
            <span> 发布类目</span>
            <el-select
              class="headline-input"
              v-model="Fromregion"
              placeholder="请输入发布类目"
            >
              <el-option label="供应商" value="shanghai"></el-option>
              <el-option label="采购商" value="beijing"></el-option>
            </el-select>
          </div>
          <div class="msg_headline-2">
            <span> 发布地区</span>
            <el-cascader
              class="headline-input"
              v-model="Cityvalue"
              :options="Cityoptions"
              :show-all-levels="false"
              placeholder="请输入发布地区"
              :props="{ expandTrigger: 'hover' }"
              @change="handleChange"
            ></el-cascader>
          </div>
          <div class="msg_headline-2">
            <span> 联系电话</span>
            <el-input
              class="headline-input"
              placeholder="请输入联系电话"
              v-model="headline"
              clearable
            >
            </el-input>
          </div>
          <div class="msg_headline-2">
            <span> 文章简介</span>
            <el-input
              class="headline-input"
              placeholder="请输入文章简介"
              v-model="headline"
              clearable
            >
            </el-input>
          </div>
        </div>
        <div class="add_spragging"></div>
        <div class="text_edit">
          <div class="edit_title">
            <p>文章正文</p>
          </div>
          <!-- 富文本编辑器 -->
          <div class="edit_content ">
            <el-card style="height: 610px;">
              <quill-editor
                v-model="content"
                class="quill-editor"
                ref="myQuillEditor"
                style="height: 500px;"
                :options="editorOption"
              >
              </quill-editor>
            </el-card>
          </div>
        </div>
        <div class="add_spragging"></div>

        <div class="text_img">
          <div class="img_title">
            <p>封面图片</p>
          </div>

          <div class="img_upload">
            <el-upload
              class="addleft"
              ref="upload_img"
              action=""
              accept="image/jpeg,image/jpg,image/png"
              list-type="picture-card"
              :on-remove="handleRemove"
              :on-exceed="handleExceedimg"
              :limit="1"
              :file-list="file_list"
              :http-request="uploadSectionFile"
            >
              <i class="el-icon-plus"></i>
            </el-upload>
            <el-dialog :visible.sync="dialogVisible" class="addstyle">
              <img width="100%" :src="dialogImageUrl" alt="" />
            </el-dialog>
            <div slot="tip" class="el-upload__tip addtitile">
              只能一张上传jpeg、jpg、png 格式的图片，图片大小在2M以内。
            </div>
          </div>
        </div>
        <div class="text_img_2">
          <div class="img_title">
            <p>轮播图片</p>
          </div>

          <div class="img_upload">
            <el-upload
              class="addleft"
              ref="upload_img"
              action=""
              accept="image/jpeg,image/jpg,image/png"
              list-type="picture-card"
              :on-remove="handleRemove"
              :on-exceed="handleExceedimg"
              :limit="5"
              :file-list="file_list"
              :http-request="uploadSectionFile"
            >
              <i class="el-icon-plus"></i>
            </el-upload>
            <el-dialog :visible.sync="dialogVisible" class="addstyle">
              <img width="100%" :src="dialogImageUrl" alt="" />
            </el-dialog>
            <div slot="tip" class="el-upload__tip addtitile">
              最多上传5张jpeg、jpg、png 格式的图片，图片大小在2M以内。
            </div>
          </div>
        </div>
        <div class="text_button">
          <div class="button_div">
            <el-button
              class="addbutton"
              type="danger"
              @click="
                TextSubmit(
                  headline,
                  Industry_tag,
                  rightchoose,
                  synopsis,
                  coverImg,
                  detailContent
                )
              "
              >发布</el-button
            >
          </div>
        </div>
      </div>
    </el-main>

    <!--********** 底部 -->
    <el-footer style="height:auto">
      <e-footer></e-footer>
    </el-footer>
  </el-container>
</template>
<script>
import eHeader from "@/components/public/Header.vue";
import eContentFrame from "@/components/public/ContentFrame.vue";
import eContentTag from "@/components/public/ContentTag.vue";
import eAdvertisingSpace from "@/components/public/AdvertisingSpace.vue";
import eFooter from "@/components/public/Footer.vue";

import { throttle } from "../../common/public.js";
import { quillEditor } from "vue-quill-editor"; //调用编辑器
import "quill/dist/quill.core.css";
import "quill/dist/quill.snow.css";
import "quill/dist/quill.bubble.css";

export default {
  //props: ["content"],
  data() {
    return {
      text_cate_name: "我的发布",
      head_title: "",
      rightoptions: [],
      rightchoose: [],
      synopsis: "",
      coverImg: "",

      quillUpdateImg: false, // 根据图片上传状态来确定是否显示loading动画，刚开始是false,不显示
      header: { token: sessionStorage.token }, // 有的图片服务器要求请求头需要有token之类的参数，写在这里
      detailContent: "", // 富文本内容

      serverUrl: "/picupload", // 这里写你要上传的图片服务器地址
      // header: { token: sessionStorage.token },  // 有的图片服务器要求请求头需要有token
      textvalue: this.content,

      dialogImageUrl: "",
      dialogVisible: false,
      file_list: [
        //展示已上传的图片数据  【修改时用的】
        // {
        //   name: '01',
        //   url: 'http://voucher-backend.frgiftcube.com:80/upload/2019/07/31/1847366e138ac779a7c5bd229b65a2d4e130a1e5.jpg'
        // }
      ],
      accessId: 0,
      imglist: false,
      loading: false,
      Cityvalue: [],
      Cityoptions: [
        {
          value: "101010100",
          label: "北京",
          children: [
            {
              value: "101010100",
              label: "北京",
              province_name: "北京",
              parent_name: "中国",
              lng: "39.904989",
              lat: "116.405285"
            }
          ]
        },
        {
          value: "101020100",
          label: "上海",
          children: [
            {
              value: "101020100",
              label: "上海",
              province_name: "上海",
              parent_name: "中国",
              lng: "31.231706",
              lat: "121.472644"
            }
          ]
        },
        {
          value: "101030100",
          label: "天津",
          children: [
            {
              value: "101030100",
              label: "天津",
              province_name: "天津",
              parent_name: "中国",
              lng: "39.125596",
              lat: "117.190182"
            }
          ]
        },
        {
          value: "101040100",
          label: "重庆",
          children: [
            {
              value: "101040100",
              label: "重庆",
              province_name: "重庆",
              parent_name: "中国",
              lng: "29.291965",
              lat: "108.170255"
            }
          ]
        },
        {
          value: "101050101",
          label: "黑龙江",
          children: [
            {
              value: "101050101",
              label: "哈尔滨",
              province_name: "哈尔滨",
              parent_name: "中国",
              lng: "45.756967",
              lat: "126.642464"
            }
          ]
        },
        {
          value: "101050101",
          label: "黑龙江",
          children: [
            {
              value: "101050101",
              label: "哈尔滨",
              province_name: "哈尔滨",
              parent_name: "中国",
              lng: "45.756967",
              lat: "126.642464"
            }
          ]
        },

        {
          value: "zujian",
          label: "组件",
          children: [
            {
              value: "basic",
              label: "Basic",
              children: [
                {
                  value: "layout",
                  label: "Layout 布局"
                },
                {
                  value: "color",
                  label: "Color 色彩"
                },
                {
                  value: "typography",
                  label: "Typography 字体"
                },
                {
                  value: "icon",
                  label: "Icon 图标"
                },
                {
                  value: "button",
                  label: "Button 按钮"
                }
              ]
            },
            {
              value: "form",
              label: "Form",
              children: [
                {
                  value: "radio",
                  label: "Radio 单选框"
                },
                {
                  value: "checkbox",
                  label: "Checkbox 多选框"
                },
                {
                  value: "input",
                  label: "Input 输入框"
                },
                {
                  value: "input-number",
                  label: "InputNumber 计数器"
                },
                {
                  value: "select",
                  label: "Select 选择器"
                },
                {
                  value: "cascader",
                  label: "Cascader 级联选择器"
                },
                {
                  value: "switch",
                  label: "Switch 开关"
                },
                {
                  value: "slider",
                  label: "Slider 滑块"
                },
                {
                  value: "time-picker",
                  label: "TimePicker 时间选择器"
                },
                {
                  value: "date-picker",
                  label: "DatePicker 日期选择器"
                },
                {
                  value: "datetime-picker",
                  label: "DateTimePicker 日期时间选择器"
                },
                {
                  value: "upload",
                  label: "Upload 上传"
                },
                {
                  value: "rate",
                  label: "Rate 评分"
                },
                {
                  value: "form",
                  label: "Form 表单"
                }
              ]
            },
            {
              value: "data",
              label: "Data",
              children: [
                {
                  value: "table",
                  label: "Table 表格"
                },
                {
                  value: "tag",
                  label: "Tag 标签"
                },
                {
                  value: "progress",
                  label: "Progress 进度条"
                },
                {
                  value: "tree",
                  label: "Tree 树形控件"
                },
                {
                  value: "pagination",
                  label: "Pagination 分页"
                },
                {
                  value: "badge",
                  label: "Badge 标记"
                }
              ]
            },
            {
              value: "notice",
              label: "Notice",
              children: [
                {
                  value: "alert",
                  label: "Alert 警告"
                },
                {
                  value: "loading",
                  label: "Loading 加载"
                },
                {
                  value: "message",
                  label: "Message 消息提示"
                },
                {
                  value: "message-box",
                  label: "MessageBox 弹框"
                },
                {
                  value: "notification",
                  label: "Notification 通知"
                }
              ]
            },
            {
              value: "navigation",
              label: "Navigation",
              children: [
                {
                  value: "menu",
                  label: "NavMenu 导航菜单"
                },
                {
                  value: "tabs",
                  label: "Tabs 标签页"
                },
                {
                  value: "breadcrumb",
                  label: "Breadcrumb 面包屑"
                },
                {
                  value: "dropdown",
                  label: "Dropdown 下拉菜单"
                },
                {
                  value: "steps",
                  label: "Steps 步骤条"
                }
              ]
            },
            {
              value: "others",
              label: "Others",
              children: [
                {
                  value: "dialog",
                  label: "Dialog 对话框"
                },
                {
                  value: "tooltip",
                  label: "Tooltip 文字提示"
                },
                {
                  value: "popover",
                  label: "Popover 弹出框"
                },
                {
                  value: "card",
                  label: "Card 卡片"
                },
                {
                  value: "carousel",
                  label: "Carousel 走马灯"
                },
                {
                  value: "collapse",
                  label: "Collapse 折叠面板"
                }
              ]
            }
          ]
        },
        {
          value: "ziyuan",
          label: "资源",
          children: [
            {
              value: "axure",
              label: "Axure Components"
            },
            {
              value: "sketch",
              label: "Sketch Templates"
            },
            {
              value: "jiaohu",
              label: "组件交互文档"
            }
          ]
        }
      ],
      content: null,
      editorOption: {},
      label_list: []
    };
  },
  components: {
    eHeader,
    eContentFrame,
    eContentTag,
    eAdvertisingSpace,
    quillEditor,
    //quillRedefine,
    eFooter
  },
  created() {
    //发布行业标签列表
    this.Postlabel_list();
  },
  mounted() {},
  computed: {
    editor() {
      return this.$refs.myQuillEditor.quill;
    }
  },
  methods: {
    //发布行业标签列表
    Postlabel_list() {
      let _this = this;

      _this.$axios.post(_this.$basis + "/label_list").then(res => {
        let data = res.data.data;
        let resdata = res.data;
        _this.label_list = [];
        console.log(res);
        switch (resdata.code) {
          case 0:
            for (let i = 0; i < data.length; i++) {
              _this.label_list.push({
                id: i,
                itemid: data[i].id,
                name: data[i].label_name
              });
            }
            break;
          case 1:
            console.log(resdata.msg);
            break;
        }
      });
    },
    onEditorReady(editor) {
      // 准备编辑器
    },
    onEditorBlur() {
      console.log(this.form);
    }, // 失去焦点事件
    onEditorFocus() {}, // 获得焦点事件
    onEditorChange() {}, // 内容改变事件

    //次级联动
    handleChange(value) {
      console.log(value);
    },
    //**********封面图片上传部分
    //文件超出个数限制时的钩子【判断上传的图片是否超过限制，超过提醒删除再进行上传】
    handleExceedimg: function() {
      this.$alert("图片最多上传一张，请删除再重新上传！", "", {
        showConfirmButton: false,
        callback: action => {}
      });
    },
    // 文件列表移除文件时的钩子
    handleRemove: function(file, fileList) {
      this.dialogImageUrl = "";
    },
    uploadSectionFile: function(params) {
      // 自定义上传方法
      let _this = this,
        file = params.file, //获取上传的文件
        fileType = file.type, //获取文件类型
        isImage = fileType.indexOf("image") != -1, // 判断是否是图片类型
        isLt2M = file.size / 1024 / 1024 < 2;

      if (!isLt2M) {
        // 判断大小
        alert("上传图片的大小不能超过 2MB!");
        _this.$refs.upload_img.uploadFiles = []; //不符合就清空已选择的图片
        return;
      }
      if (!isImage) {
        // 文件格式
        alert("请选择图片文件！");
        _this.$refs.upload_img.uploadFiles = []; //不符合就清空已选择的图片
        return;
      }
      if (isImage) {
        var img = new Image();
        //  一切验证通过后调用上传方法
        _this.uploadFile(file);
      }
    },
    uploadFile: function(file) {
      // 上传的函数
      var _this = this;
      // let Url = "/start/picupload"
      let datas = new FormData();
      datas.append("file", file);
      _this.$axios
        .post(_this.$basis + "/imageup", datas, {
          headers: { "content-type": "multipart/form-data" }
        })
        .then(res => {
          // let resdata = res.data;
          console.log(res);
          if (res.data.code == 0) {
            //成功的话将数据插入data中
            _this.coverImg = res.data.src;
            _this.showError("success", "图片上传成功");
          } else {
            // 上传失败，清除已选择 内容 ，并提示失败原因
            _this.$refs.upload_img.uploadFiles = [];
            _this.file_list[0] = "";

            _this.showError("error", "图片上传异常，请重新上传图片");
            // _this.$alert('图片上传异常，请重新上传图片', {
            //     showConfirmButton: false,
            //     callback: action => { }
            // });
          }
        });
    },
    //发布文章
    TextSubmit: throttle(function(
      head_title,
      Industry_tag,
      rightchoose,
      synopsis,
      coverImg,
      detailContent
    ) {
      let _this = this;
      if (head_title == "") {
        (_this.head_title = ""),
          _this.$alert("请填写标题", {
            callback: action => {}
          });
      } else if (Industry_tag == []) {
        (_this.Industry_tag = []),
          _this.$alert("请选择您要发布的类目", {
            callback: action => {}
          });
      } else if (rightchoose == []) {
        (_this.rightchoose = []),
          _this.$alert("请选择您要发布的具体文章类型", {
            callback: action => {}
          });
      } else if (synopsis == "") {
        (_this.synopsis = ""),
          _this.$alert("请填写文章简介", {
            callback: action => {}
          });
      } else if (coverImg == "") {
        (_this.coverImg = ""),
          _this.$alert("请上传文章封面", {
            callback: action => {}
          });
      } else if (detailContent == "") {
        (_this.detailContent = ""),
          _this.$alert("请填入文章内容", {
            callback: action => {}
          });
      } else if (
        head_title != "" &&
        Industry_tag != [] &&
        rightchoose != [] &&
        synopsis != "" &&
        coverImg != "" &&
        detailContent != ""
      ) {
        _this.loading = true;
        rightchoose = rightchoose.toString();
        let Url = "/article";
        let Params = {
          m_id: _this.accessId,
          cate_id: rightchoose,
          title: head_title,
          seo_keywords: synopsis,
          thumb: coverImg,
          content: detailContent
        };
        _this.$https.fetchPost(Url, Params).then(res => {
          let resdata = res.data;
          switch (resdata.code) {
            case 0:
              _this.loading = false;
              _this.$alert("发布成功！", {
                callback: action => {}
              });

              _this.$router.push("/Mypublish");
              break;
            case 2000:
              _this.loading = false;
              _this.$alert("发布失败！" + resdata.msg + ",请重新发布", {
                callback: action => {}
              });
              break;
            case 2001:
              _this.loading = false;
              _this.$alert("发布失败！" + resdata.msg + ",请重新发布", {
                callback: action => {}
              });

              sessionStorage.setItem("head_title", head_title);
              sessionStorage.setItem("Industry_tag", Industry_tag);
              sessionStorage.setItem(
                "rightchoose",
                JSON.stringify(rightchoose)
              );
              sessionStorage.setItem("synopsis", synopsis);
              sessionStorage.setItem("coverImg", coverImg);
              sessionStorage.setItem("detailContent", detailContent);
              // _this.PayOpen();
              break;
          }
        });
      }
    },
    5000),
    //消息提示
    showError(type, status) {
      this.$message({
        type: type,
        showClose: true,
        center: true,
        message: status
      });
    }
  }
};
</script>
<style lang="scss" scoped>
.el-container {
  overflow: hidden;
}
.el-main {
  overflow: auto;
  padding: 0;
}

$font-color: #fff;
$bg-color: rgba(46, 139, 87, 0.4);
$btn-color: #409eff;
$shadow-color: 3px 7px 50px -12px rgba(64, 158, 255, 0.4);
@mixin bubbleAnimation($send1, $send2) {
  animation: bubble $send1 linear infinite,
    direction $send2 ease-in-out infinite alternate;
}
.new-advlocation {
  display: flex;
  justify-content: center;
  width: 100%;
  min-width: 770px;
  height: 260px;
  .adv_container {
    height: 260px;
    .middle-net {
      height: 260px;
    }
  }
}
.add_line {
  width: 100%;
  height: 40px;
  padding-left: 18.5%;
  padding-top: 15px;
  color: #606266;
  .addbreadcrumb {
    width: 100%;
    height: 40px;
    font-size: 14px;
    padding-top: 13px;
    float: left;
    border-bottom: 2px solid #f6f6f6;
  }
}
.mo_login {
  position: relative;
  max-width: 1200px;
  width: 100%;
  min-width: 1000px;
  margin: 0 auto;
  margin-top: 25px;
  margin-bottom: 20px;
  padding: 0 0px 20px 0px;
  height: auto;

  overflow-y: hidden;
  background: #ffffff;
  // background: #fbfbfb;
  background-position: left top;
  background-repeat: no-repeat;
  background-size: 100% 100%;
  &:before {
    content: "";
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    //background-image: linear-gradient(-225deg, #7de2fc 0%, #b9b6e5 100%);
    z-index: -1;
  }

  .text_title {
    width: 100%;
    height: 89px;
    padding: 12px 0 0 14px;
    text-align: left;
    background: #ffffff;
    font-size: 20px;
    font-weight: bold;
    color: #333333;
    .title-yin {
      padding-top: 12px;
      font-size: 12px;
    }
    .title-line {
      //width: 915px;
      width: 78%;
      height: 1px;
      padding-top: 11px;
      border-bottom: 1px solid #f6f6f6;
    }
  }
  .add_spragging {
    width: 100%;
    height: 40px;
    background: #f6f6f6;
  }
  .text_msg {
    width: 100%;
    height: 380px;
    background: #ffffff;
    border-radius: 6px;
    .msg_headline {
      display: flex;
      justify-content: flex-start;
      width: 100%;
      height: 65px;
      padding: 5px 25px 21px 25px;
      span {
        line-height: 44px;
        color: #252525;
        font-size: 16px;
      }
      .headline-input {
        width: 380px;
        height: 44px;
        border-radius: 4px;
        padding-left: 10px;
      }
    }
    .msg_headline-2 {
      display: flex;
      justify-content: flex-start;
      width: 100%;
      height: 60px;
      padding: 0px 25px 16px 25px;
      span {
        line-height: 44px;
        color: #252525;
        font-size: 16px;
      }
      .headline-input {
        width: 380px;
        height: 44px;
        border-radius: 4px;
        padding-left: 10px;
      }
    }
    .mes_choose {
      width: 100%;
      height: 40px;
      float: left;
      padding-left: 26px;

      .left_choose {
        width: 15%;
        height: 100%;
        float: left;
        margin-right: 40px;
      }
      .right_choose {
        width: 15%;
        height: 100%;
        float: left;
      }
    }
    .msg_synopsis {
      width: 100%;
      height: 66px;
      margin-top: 29px;
      padding: 28px 25px 22px 25px;
      .headline-input {
        width: 100%;
        height: 32px;
        // background: #F5F7FA;
        border-radius: 4px;
        //border:1px solid #dddddd;
      }
    }
  }
  .text_msg /deep/ .el-input--small .el-input__inner {
    height: 44px;
    line-height: 40px;
  }
  .text_img {
    width: 100%;
    height: 208px;
    background: #ffffff;
    border-radius: 6px;
    padding: 12px 0 0 16px;
    .img_title {
      width: 8%;
      height: 0px;
      padding: 2px 0 0 10px;
      text-align: left;
      background: #fbfbfb;
      font-size: 14px;
      font-weight: 400;
      color: #252525;
      margin-bottom: 22px;
      float: left;
    }
    .img_upload {
      width: 50%;
      height: auto;
      float: left;
      .addleft {
        float: left;
        // width: 128px;
        // height: 128px;
      }
      .addleft >>> .el-upload--picture-card {
        width: 128px;
        height: 128px;
      }

      .addleft >>> .el-upload-list--picture-card .el-upload-list__item {
        width: 128px;
        height: 128px;
      }
      .addstyle {
        width: 20px;
        height: 20px;
      }
    }
  }
  .text_img_2 {
    width: 100%;
    height: 208px;
    background: #ffffff;
    border-radius: 6px;
    padding: 12px 0 0 16px;
    .img_title {
      width: 8%;
      height: 0px;
      padding: 2px 0 0 10px;
      text-align: left;
      background: #fbfbfb;
      font-size: 14px;
      font-weight: 400;
      color: #252525;
      margin-bottom: 22px;
      float: left;
    }
    .img_upload {
      width: 80%;
      height: auto;
      float: left;
      .addleft {
        float: left;
        // width: 128px;
        // height: 128px;
      }
      .addleft >>> .el-upload--picture-card {
        width: 128px;
        height: 128px;
      }

      .addleft >>> .el-upload-list--picture-card .el-upload-list__item {
        width: 128px;
        height: 128px;
      }
      .addstyle {
        width: 20px;
        height: 20px;
      }
    }
  }
  .text_edit {
    width: 100%;
    height: 600px;
    background: #ffffff;
    border-radius: 6px;
    overflow: hidden;
    .edit_title {
      width: 100%;
      height: 0px;
      padding: 12px 0 0 16px;
      text-align: left;
      background: #ffffff;
      font-size: 14px;
      font-weight: 400;
      color: #252525;
      margin-bottom: 22px;
    }
    .edit_content {
      width: 100%;
      height: auto;
      border-radius: 4px;
      //border-bottom: 1px solid #dddddd;
    }
  }
  .text_button {
    width: 100%;
    height: 51px;
    padding-left: 25px;
    background: #ffffff;
    .button_div {
      // margin-top: 10px;
      width: 16%;
      height: 46px;
      float: left;
      .addbutton {
        width: 100%;
        height: 100%;
        font-size: 18px;
        font-family: PingFangSC-Regular, PingFang SC;
        font-weight: 400;
        color: #f5f2eb;
      }
    }
  }
}
.mo_login /deep/ .el-loading-spinner {
  font-size: 30px;
}
.addtitile {
  width: 100%;
  height: 30px;
  float: left;
  text-align: left;
}
.quill-editor {
  line-height: normal;
}
</style>
